@charset "utf-8";
#root {
    height: 100%;
}

#root,
#overlay-root,
#notification-root {
    background-color: var(--bg-color);
    color: var(--text-color);
    font-family: var(--family-sans-serif);
    font-size: var(--small-text-size);
}

.app-splash {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--bg-color);
}

.app-splash-text {
    color: var(--light-text-color);
    font-size: var(--small-text-size);

    &:after {
        overflow: hidden;
        display: inline-flex;
        vertical-align: bottom;
        animation: ellipsis steps(4, end) 900ms infinite;
        content: '...';
        width: 0px;
    }
}

.empty-message {
    margin-top: 20%;
    padding: 0px 20%;
    text-align: center;
    font-size: var(--xxxlarge-text-size);
    font-weight: bold;
    color: var(--border-color);
    user-select: none;
}

.ReactVirtualized__Grid {
    outline: none;
}

@import './stylesheets/_html.scss';
